<template>
  <a-modal v-model:visible="visible" title="查看代码" centered @ok="visible = false" width="70%" wrap-class-name="full-modal">
    <template #footer>
      <!-- <a-button type="primary" @click="saveForm()" :loading="saveLoading">提交</a-button> -->
      <a-button type="danger" ghost @click="visible = false" class="ml-24">关闭</a-button>
    </template>
    <a-spin :spinning="saveLoading">
      <a-radio-group v-model:value="activeCode">
        <a-radio-button value="domain">Domain</a-radio-button>
        <a-radio-button value="mapper">Mapper</a-radio-button>
        <a-radio-button value="mapperXml">MapperXml</a-radio-button>
        <a-radio-button value="service">Service</a-radio-button>
        <a-radio-button value="serviceImpl">ServiceImpl</a-radio-button>
        <a-radio-button value="controller">Controller</a-radio-button>
        <a-radio-button value="service.js">Service.js</a-radio-button>
        <a-radio-button value="index.vue">Index.vue</a-radio-button>
        <a-radio-button value="info.vue">Info.vue</a-radio-button>
      </a-radio-group>

      <MdEditorJavaCode v-model:text="code" />
    </a-spin>
  </a-modal>
</template>
<script>
import { defineComponent, reactive, toRefs, watch } from "vue";
import service from "@/service/development_tool/gen_service";
import MdEditorJavaCode from "@/components/MdEditorJavaCode.vue";

export default defineComponent({
  name: "system_function_info",
  props: {
    onSuccess: Function,
  },
  components: { MdEditorJavaCode },
  setup(props, context) {
    const state = reactive({
      vm: {
        id: "",
        form: {},
      },
      visible: false,
      saveLoading: false,
      activeCode: "domain",
      code: "",
      domain: {
        code: "",
      },
      mapper: {
        code: "",
      },
      mapperXml: {
        code: "",
      },
      service: {
        code: "",
      },
      serviceImpl: {
        code: "",
      },
      controller: {
        code: "",
      },
      serviceJs: {
        code: "",
      },
      indexVue: {
        code: "",
      },
      infoVue: {
        code: "",
      },
    });

    const methods = {
      //打开表单初始化
      openForm({ visible, key }) {
        state.visible = visible;
        if (visible) {
          state.vm.id = key;

          state.activeCode = "domain";

          this.getDomain(() => {
            state.code = state.domain.code;
          });
          this.getMapper();
          this.getMapperXml();
          this.getService();
          this.getServiceImpl();
          this.getController();
          this.getServiceJs();
          this.getIndexVue();
          this.getInfoVue();
        }
      },
      getDomain(call) {
        service
          .genDomain({
            tableName: state.vm.id,
            packageInfo: "com.hzy.admin.domain",
          })
          .then((res) => {
            state.domain.code = "```java \r\n" + res.data + " \r\n```";
            if (call) call();
          });
      },
      getMapper() {
        service
          .genMapper({
            tableName: state.vm.id,
            packageInfo: "com.hzy.admin.mapper",
          })
          .then((res) => {
            state.mapper.code = "```java \r\n" + res.data + " \r\n```";
          });
      },
      getMapperXml() {
        service
          .genMapperXml({
            tableName: state.vm.id,
            // packageInfo: "com.hzy.admin.mapper",
          })
          .then((res) => {
            state.mapperXml.code = "```xml \r\n" + res.data + " \r\n```";
          });
      },
      getService() {
        service
          .genService({
            tableName: state.vm.id,
            packageInfo: "com.hzy.admin.service",
          })
          .then((res) => {
            state.service.code = "```java \r\n" + res.data + " \r\n```";
          });
      },
      getServiceImpl() {
        service
          .genServiceImpl({
            tableName: state.vm.id,
            packageInfo: "com.hzy.admin.service.impl",
          })
          .then((res) => {
            state.serviceImpl.code = "```java \r\n" + res.data + " \r\n```";
          });
      },
      getController() {
        service
          .genController({
            tableName: state.vm.id,
            packageInfo: "com.hzy.admin.controller",
          })
          .then((res) => {
            state.controller.code = "```java \r\n" + res.data + " \r\n```";
          });
      },
      getServiceJs() {
        service
          .genServiceJs({
            tableName: state.vm.id,
            // packageInfo: "com.hzy.admin.controller",
          })
          .then((res) => {
            state.serviceJs.code = "```js \r\n" + res.data + " \r\n```";
          });
      },
      getIndexVue() {
        service
          .genIndexVue({
            tableName: state.vm.id,
            // packageInfo: "com.hzy.admin.controller",
          })
          .then((res) => {
            state.indexVue.code = "```vue \r\n" + res.data + " \r\n```";
          });
      },
      getInfoVue() {
        service
          .genInfoVue({
            tableName: state.vm.id,
            // packageInfo: "com.hzy.admin.controller",
          })
          .then((res) => {
            state.infoVue.code = "```vue \r\n" + res.data + " \r\n```";
          });
      },
    };

    watch(
      () => state.activeCode,
      (value) => {
        if (value == "domain") {
          state.code = state.domain.code;
        }
        if (value == "mapper") {
          state.code = state.mapper.code;
        }
        if (value == "mapperXml") {
          state.code = state.mapperXml.code;
        }
        if (value == "service") {
          state.code = state.service.code;
        }
        if (value == "serviceImpl") {
          state.code = state.serviceImpl.code;
        }
        if (value == "controller") {
          state.code = state.controller.code;
        }
        if (value == "service.js") {
          state.code = state.serviceJs.code;
        }
        if (value == "index.vue") {
          state.code = state.indexVue.code;
        }
        if (value == "info.vue") {
          state.code = state.infoVue.code;
        }
      }
    );

    context.expose({ ...methods });

    return {
      ...toRefs(state),
      ...methods,
    };
  },
});
</script>
<style lang="less" scoped>
.ant-form-item {
  margin-bottom: 0;
}
</style>

<style lang="less">
.full-modal {
  .ant-modal {
    max-width: 100%;
    top: 0;
    padding-bottom: 0;
    margin: 0;
  }
  .ant-modal-content {
    display: flex;
    flex-direction: column;
    height: calc(100vh);
  }
  .ant-modal-body {
    flex: 1;
    overflow: auto;
  }
}
</style>
